<template>
  <!-- 项目分包-分包合同新增 5-4-->
  <div class="common-wrap">
    <h3>分包合同新增</h3>
    <a-form :form="form">
      <a-form-item label="项目名称" :label-col="{ span: 2 }">
        <a-select size="large" v-decorator="[
          '请输入项目名称',
          {rules: [{ required: true, message: '请输入请输入项目名称' }]}
        ]" placeholder="请输入请输入项目名称">
          <a-select-option value="项目A">
            项目A
          </a-select-option>
        </a-select>
      </a-form-item>
      <a-form-item label="项目编号" :label-col="{ span: 2 }">
         <a-select size="large" v-decorator="[
          '请输入项目编号',
          {rules: [{ required: true, message: '请输入请输入项目编号' }]}
        ]" placeholder="请输入请输入项目编号">
          <a-select-option value="项目A">
            项目A
          </a-select-option>
        </a-select>
      </a-form-item>
      <a-form-item label="分包商" :label-col="{ span: 2 }">
          <a-select size="large" v-decorator="[
          '请输入分包商',
          {rules: [{ required: true, message: '请输入请输入分包商' }]}
        ]" placeholder="请输入请输入分包商">
          <a-select-option value="项目A">
            项目A
          </a-select-option>
        </a-select>
      </a-form-item>
      <a-form-item label="负责人" :label-col="{ span: 2 }">
        <a-input size="large" disabled="true" v-decorator="[
          '负责人',
          {rules: [{ required: true, message: '请输入负责人' }]}
        ]" />
      </a-form-item>
      <a-form-item label="单价" :label-col="{ span: 2 }">
        <a-input size="large" placeholder="请输入单价" v-decorator="[
          '单价',
          {rules: [{ required: true, message: '请输入单价' }]}
        ]" />
      </a-form-item>
      <a-form-item>
        <div class="sumbitButton">
          <a-button type="primary" class="buttonColorGreen" size="large">提交</a-button>
          <a-button class="buttonColorWhite" size="large" @click="cancel">取消</a-button>
        </div>
      </a-form-item>
    </a-form>
  </div>
</template>

<script>
export default {
  props: {
    subcontractAddShow: Boolean
  },
  data() {
    return {
      form: this.$form.createForm(this)
    }
  },
  methods: {
    cancel() {
      this.$emit('update:subcontractAddShow', false)
    }
  }
}
</script>

<style scoped>
h3 {
  margin-bottom: 25px;
}
>>>.ant-input,>>>.ant-select {
  width: 300px;
}
.sumbitButton {
  display: flex;
  justify-content: center;
  margin-bottom: 50px;
}
.sumbitButton button {
  margin: 20px 30px;
}
</style>

